<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery幸运大转盘抽奖代码</title>
<meta name="keywords" content="jQuery,幸运大转盘,抽奖代码" />
<meta name="description" content="jQuery幸运大转盘抽奖代码。" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<body class="keBody">
<h1 class="keTitle">U袋网优惠大抽奖</h1>
<div class="kePublic">	
<!--效果html开始-->
<div class="dowebok">
  <div class="rotary"> <img class="hand" src="images/z.png" alt=""> </div>
  <div class="list"> <strong>100%中奖</strong>
    <h4>中奖用户名单</h4>
    <ul>
		<font size="4"><span style="margin-left: 10px;">用户</span><span style="margin-left: -30px;">奖品</span></font>
		<div id="str"></div>
	<span id="hb" style="display: none;"></span><span id="mz" style="display: none;"></span>
	 <!-- <li> <span>154**88</span> <span>获得1个月绿钻</span> </li>
      <li> <span>6161***034</span> <span>获得11个月绿钻</span> </li>
      <li> <span>2349***224</span> <span>获得1个月绿钻</span> </li>
      <li> <span>433***54</span> <span>获得2个月绿钻</span> </li>
      <li> <span>5154***234</span> <span>获得4个月绿钻</span> </li>
      <li> <span>3213***123</span> <span>获得2个月绿钻</span> </li>
      <li> <span>898****362</span> <span>获得9个月绿钻</span> </li> -->
    </ul>
  </div>
</div>
<script src="js/jquery-1.8.3.min.js"></script> 
<script src="js/jquery.rotate.min.js"></script> 
<script>
$(function(){
	var $hand = $('.hand');

	$hand.click(function(){
		var data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
		data = data[Math.floor(Math.random()*data.length)]; 
		switch(data){
			case 1:
				rotateFunc(1,16,'恭喜你抽中了5元优惠券');
				document.getElementById("hb").innerHTML="5元优惠券";
				document.getElementById("mz").innerHTML="5";
				gett();
				break;
			case 2:
				rotateFunc(2,47,'恭喜你抽中了10元优惠券');
				document.getElementById("hb").innerHTML="10元优惠券";
				document.getElementById("mz").innerHTML="10";
				gett();
				break;
			case 3:
				rotateFunc(3,76,'恭喜你抽中了15元优惠券');
				document.getElementById("hb").innerHTML="15元优惠券";
				document.getElementById("mz").innerHTML="15";
				gett();
				break;
			case 4:
				rotateFunc(4,106,'恭喜你抽中了5元优惠券');
				document.getElementById("hb").innerHTML="5元优惠券";
				document.getElementById("mz").innerHTML="5";
				gett();
				break;
			case 5:
				rotateFunc(5,135,'恭喜你抽中了3元优惠券');
				document.getElementById("hb").innerHTML="3元优惠券";
				document.getElementById("mz").innerHTML="3";
				gett();
				break;
			case 6:
				rotateFunc(6,164,'谢谢惠顾');
				break;
			case 7:
				rotateFunc(7,193,'恭喜你抽中了3元优惠券');
				document.getElementById("hb").innerHTML="3元优惠券";
				document.getElementById("mz").innerHTML="3";
				gett();
				break;
			case 8:
				rotateFunc(7,223,'恭喜你抽中了10元优惠券');
				document.getElementById("hb").innerHTML="10元优惠券";
				document.getElementById("mz").innerHTML="10";
				gett();
				break;
			case 9:
				rotateFunc(7,252,'恭喜你抽中了15元优惠券');
				document.getElementById("hb").innerHTML="15元优惠券";
				document.getElementById("mz").innerHTML="15";
				gett();
				break;
			case 10:
				rotateFunc(7,284,'恭喜你抽中了5元优惠券');
				document.getElementById("hb").innerHTML="5元优惠券";
				document.getElementById("mz").innerHTML="5";
				gett();
				break;
			case 11:
				rotateFunc(7,314,'恭喜你抽中了3元优惠券');
				document.getElementById("hb").innerHTML="3元优惠券";
				document.getElementById("mz").innerHTML="3";
				gett();
				break;
			case 12:
				rotateFunc(7,345,'谢谢惠顾');
				break;
		}
		
	});

	var rotateFunc = function(awards,angle,text){
		$hand.stopRotate();
		$hand.rotate({
			angle: 0,
			duration: 5000,
			animateTo: angle + 1440,
			callback: function(){
				alert(text);
				 get();
			}
		});
	};
});
</script>
<!--效果html结束-->
<div class="clear"></div>
</div>
<style>
	a{ color: #fff;}
</style>
</body>
<script>
	
	 get() 
function get() {
		// alert("dsf")
		$.ajax({
				method:"post",
				url:"http://localhost:16200/prizeUser?users=123",
				dataType:"json",
				success:function(date){
					str="";
					
                for(i in date){
			        str+=date[i].users+'&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp'+date[i].redenvelopes+"<br>";
				
                }
				document.getElementById("str").innerHTML=str;
				// str[0].innerHTML=str
				},
				})

				}
				
				
				function gett(){
					var  redenvelopes=document.getElementById("hb").innerHTML;
					var  parvalue=document.getElementById("mz").innerHTML;
					// alert(redenvelopes+"sasfds");
					var users="234114";
					$.ajax({
						method:"post",
						dataType:"json",
						url:"http://localhost:16200/recharge",
						data:{
							users:users,
							redenvelopes:redenvelopes,
							parvalue:parvalue
						},
						success:function(date){
						if(date==true){
							// alert("添加成功");
						}
						},
					});
				}

	
		
</script>
</html>